<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.9/vue.js"></script>
    </head>
    <body>
        <div id="app">
            <input type="text" v-model="name" />
            <hr />
            <h2 v-text="name"></h2>
            <input type="text" v-model="num" />
            {{ name }} {{ num }} <span @click="increment">[+]</span>
        </div>
        <script>
            new Vue({
                el: '#app',
                data: {
                    name: 'houdunren',
                    num: 1,
                },
                methods: {
                    increment() {
                        this.num++
                    },
                },
            })
        </script>
    </body>
</html>
